<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>bootstrap后台模板设计</title>
    <!--主要样式控制-->
    <link href="../b_css/bootstrap.css" rel="stylesheet">
    <style>
        .box {
            width: 100%;
            height: 1000px;
            background-color: #f1f1f1;
        }
        .box_header {
            /* margin: 0 auto; */
            padding: 30px 60px 60px 60px;
            width: 100%;
            height: 100%;
            background-color: #fff;
            border-radius: 10px;
            box-shadow: 2px 2px 4px 2px #ddd;
            /* border-left: 1px  solid #ccc; */
        }
        .box .user {
            width: 600px;
            height: 60px;
            line-height: 60px;
            font-size: 16px;
            color: #000;
            display: flex;
        }
        .liber {
            margin-right: 20px;
        }
    </style>
</head>
<body>
    <div class="box">
        <div class="box_header">
            <h2>基本信息</h2>
            <div class="user">
                <div class="liber">用户名: </div><div class="username"></div>
            </div>
            <div class="user">
                <div class="liber">密码: </div><div class="password"></div>
            </div>
            <div class="user">
                <div class="liber">姓名: </div><div class="name"></div>
            </div>
            <div class="user">
                <div class="liber">性别: </div><div class="sex"> </div>
            </div>
            <div class="user">
                <div class="liber">电话: </div><div class="phone"> </div>
            </div>
            <div class="user">
                <div class="liber">邮箱: </div><div class="email"></div>
            </div>
        </div>
    </div>

    <!-- 引入样式文件和动态控制 -->
    <script src="../b_js/jquery-3.2.1.min.js"></script>
    <script src="../b_js/utils.js"></script>
    <script src="../b_js/toastr.min.js"></script>
    <script src="../b_js/bootstrap.min.js"></script>
    <script type="text/javascript">
        getUserList();
        // 获取用户信息
        function getUserList() {
            $.ajax({
                type:"get",
                url: upUrl + "/session",
                data: {},
                success:function(data){
                    if (data.code == 200) {
                        $(".username").text(data.result.username);
                        $(".name").text(data.result.name);
                        $(".password").text(data.result.password);
                        $(".sex").text(data.result.sex);
                        $(".phone").text(data.result.phone);
                        $(".email").text(data.result.email);
                    } else {
                        toastr.error(data.message);
                    }
                },
            })
        }
    </script>
    </body>
</html>